<template>
  <div style="min-height: 200px">
    <el-table :data="list" height="500px" v-loading="tableLoading" @selection-change="__tableRowSelect">
      <el-table-column type="selection" width="55"> </el-table-column>
      <el-table-column
        prop="positionEnterVO.sysUser.name"
        label="姓名"
        width="100"
      >
      </el-table-column>
      <el-table-column
        prop="positionEnterVO.sysUser.userCard"
        label="身份证"
        width="180"
      >
      </el-table-column>
      <el-table-column
        prop="positionEnterVO.sysUser.mobile"
        label="手机号"
        width="130"
      >
      </el-table-column>
      <el-table-column
        prop="positionEnterVO.settleHours"
        label="工作量"
        width="80"
      >
      </el-table-column>
      <el-table-column
        prop="positionEnterVO.position.pWage"
        label="单价"
        width="80"
      >
      </el-table-column>
      <el-table-column prop="sMoney" label="工资"> </el-table-column>
      <el-table-column prop="sStatus" label="结算状态">
        <template slot-scope="{ row }">
          <el-tag type="success" v-if="row.sStatus == 1">已结算</el-tag>
          <el-tag type="info" v-if="row.sStatus == 0">未结算</el-tag>
        </template>
      </el-table-column>
    </el-table>

    <div class="footer-btns">
      <el-button><i class="el-icon-download"></i> 导出</el-button>
      <el-button type="primary" @click="__confirm">
        <i class="el-icon-s-finance"></i> 结算</el-button
      >
    </div>
  </div>
</template>

<script>
import { getSettleListByPositionId,
settleConfirm } from "@/api/settle";
export default {
  data() {
    return {
        pId:'',
      list: [],
      tableLoading: false,
      selectedRows: [],
    };
  },
  methods: {
    __init(pId) {
        this.pId = pId
      this.tableLoading = true;
      getSettleListByPositionId({
        pId,
      }).then((res) => {
        this.tableLoading = false;
        this.list = [...res.data.records];
      });
    },

    __confirm() {
        let sIds = [];
        if(this.selectedRows&&this.selectedRows.length){
            this.selectedRows.forEach(item=>{
                sIds.push(item.sId)
            })
        };
        settleConfirm({sIds}).then(res=>{
            this.$message.success("结算成功");
            this.__init(this.pId)
        })
    },

    __tableRowSelect(e){
        this.selectedRows = e;
    }
  },
  mounted() {
    console.log("mounted");
  },
};
</script>

<style>
.footer-btns {
  display: flex;
  justify-content: flex-end;
  margin-top: 10px;
}
</style>